<script setup lang="ts">
import { mercatorTolonlat, lonlatToMercator, computeSignedArea } from "@/utils/mercator";
import { computed, ref } from "vue";

const arr = ref([
  {
    lon: 113.013876,
    lat: 28.120062,
  },
  {
    lon: 113.015452,
    lat: 28.119389,
  },
  {
    lon: 113.014626,
    lat: 28.11729,
  },
  {
    lon: 113.012982,
    lat: 28.117648,
  },
]);
const handleClick = () => {
  const a = computeSignedArea(arr.value);
  console.log("面积:" + a + "平方米");
  arr.value.forEach((item) => {
    const zb = lonlatToMercator({
      lon: item.lon,
      lat: item.lat,
    });
    console.log(zb);
    computeSignedArea;
  });
};

const arrs = computed({
  get: () => {
    return JSON.stringify(arr.value);
  },
  set: (val) => {
    arr.value = JSON.parse(val);
  },
});
</script>

<template>
  <div>
    <el-input v-model="arrs" :rows="4" type="textarea" placeholder="Please input" />

    <el-button @click="handleClick">计算</el-button>
  </div>
</template>

<style lang=""></style>
